﻿<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Demo::Web Cell::</title>
        <script src="../../release/jskit.core.js"></script>
        <script src="../../ui/JskitDynamic.js"></script>
		<script src="../../ui/JskitAnimation.js"></script>
        <script src="../../ui/JskitWebCell.js"></script>
		<script>
			//jwc data
			var data = new Array();
			data.push(new Array(0,0,"#ffff00","center"));
			data.push(new Array(1,2,"#336699","adsfafds"));
			data.push(new Array(2,-2,"#336699","adsfafds"));
			data.push(new Array(2,5,"#336699","adsfafds"));
			data.push(new Array(2,-2,"#336699","adsfafds"));
			data.push(new Array(3,-1,"#336699","adsfafds"));
			data.push(new Array(3,9,"#336699","adsfafds"));
			data.push(new Array(3,3,"#336699","adsfafds"));
			data.push(new Array(-1,5,"#336699","adsfafds"));
			data.push(new Array(-1,8,"#336699","adsfafds"));
			data.push(new Array(-2,1,"#336699","adsfafds"));
			data.push(new Array(-2,-12,"#336699","adsfafds"));
			data.push(new Array(-3,-2,"#336699","adsfafds"));
			data.push(new Array(-3,-4,"#336699","adsfafds"));
			data.push(new Array(-3,5,"#336699","adsfafds"));
			data.push(new Array(-4,5,"#336699","adsfafds"));
			
			var jwc = new JskitWebCell("jwc");
			var jd = new JskitDynamic("jd");
			function PageOnload(){
				jwc.start();
				//jwc.check();
				jd.add(jwc.getCanvas());
				jd.setRealTime(true);
				jd.setOnMoveDone("jwc.move(jd.getOffsetX(),jd.getOffsetY());pushData();");
				jskitEvents.ready("onresize","jwc.refresh");
				pushData();
			}
			function PageOnDblclick(e){
				var o = e.srcElement;
				if(jwc.isCellChild(o)){
					var lat = parseInt(o.getAttribute("lat"));
					var lon = parseInt(o.getAttribute("lon"));
					jwc.moveTo(lat,lon,"jwc.refresh("+lat+","+lon+");jwc.zoomInMax();pushData();");
				}
			}
			function pushData(){
				var obj = null;
				for(var i=0;i<data.length;i++){
					obj = jwc.setCell(data[i][0],data[i][1]);
					if(obj!=null){
						obj.style.backgroundColor = data[i][2];
						obj.innerHTML = data[i][3];
						obj.style.cursor = "hand";
					}
				}
				obj = null;
			}
        </script>
    </head>
    <body onload="PageOnload();" ondblclick="PageOnDblclick(event);" oncontextmenu="jwc.zoomOut();pushData();return false;">
    </body>
</html>